
    *{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    body::-webkit-scrollbar{
        width: 5px;
    }

    body::-webkit-scrollbar-track{
        background-color: #ffffff;
    }

    body::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 10px;
        background-color: #5c9dff;
    }
    a{
        text-decoration: none;
    }
    li{
        list-style: none;
    }
    body{
        background:url("../img/body.jpg")repeat-x;
    }
    #container{
        width: 1100px;
        height: 765px;
        margin: 0 auto;
    }
    header{
        height:108px;
        background:url("../img/header.png");
        display: flex;

    }
    header #top-left{
        width: 65%;
        height: 100%;
        background:url("../img/logo.png") no-repeat;
    }
    header #top-right{
        width: 35%;
        height: 100%;
    }
    header #top-right ul{
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: space-around;
    }
    header #top-right ul li a{
        display:block;
        width: auto;
        padding: 0px 10px 0 10px;
        height: 35px;
        text-align: center;
        line-height: 35px;
        margin-top: 5px;
        box-sizing: border-box;
        background: rgb(252,200,0);
        color: white;
        font-size: 15px;
        border-radius: 5px;

    }
    #firstpage{
        width: 100%;
        height: 30px;
    }
    #firstpage a{
        color: white;
        line-height: 30px;
        font-weight: bolder;
        font-size: 20px;
    }

    section{
        width: 100%;
        height:80%;
        display: flex;
        justify-content:space-between;
        padding:20px 0 5px 0;
        box-sizing: border-box;

    }

    section #left{
        width: 69%;
        border: 1px solid #1e81c6;
        box-sizing:border-box;
        background: white;
    }
    section #right{
        width: 29%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        background: white;
    }
    section #right #up{
        width: 100%;
        height: 48%;
        border: 1px solid #1e81c6;
        box-sizing:border-box;
    }
    section #right #up ul{
        height: 240px;
        overflow: auto;
    }
    section #right #up ul::-webkit-scrollbar{
        width:5px;
    }

    section #right #up ul::-webkit-scrollbar-track{
        background-color: #ffffff;
    }

    section #right #up ul::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 10px;
        background-color: rgb(3, 172, 6);;
    }
    #rightop{
        width: 100%;
        height: 35px;
        border-bottom:1px solid #1e81c6;
        line-height: 35px;
        text-indent: 10px;
        font-size: 14px;
        color: #1e81c6;
        font-weight: bold;
    }
    section #right #down ul{
        height: 240px;
        overflow: auto;
    }
    section #right #down ul::-webkit-scrollbar{
        width:5px;
    }

    section #right #down ul::-webkit-scrollbar-track{
        background-color: #ffffff;
    }

    section #right #down ul::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 10px;
        background-color: rgb(3, 172, 6);;
    }
    section #right ul li{
        padding: 5px;
        color: #0088D8;
        cursor: pointer;
        font-size: 14px;
    }
    section #right ul li a{
        color: #0088D8;
        cursor: pointer;
        font-size: 14px;
    }
    section #right ul li span{
        float: right;
    }
    section #right #down{
        width: 100%;
        height: 48%;
        border: 1px solid #1e81c6;
        box-sizing:border-box;
    }
    footer{
        width: 100%;
        height: 35px;
        padding-top: 10px;
        box-sizing: content-box;
        background: url(../img/bottom.jpg);
    }
    footer p{
        font-size: 12px;
        color: rgb(115, 118, 119);
        text-align: center;
    }

    #content{
        width: 100%;
        height: 100%;
        overflow: auto;
    }
    #content .back{
        width: 250px;
        height: 30px;
        border: 1px solid #1e81c6;
        display: block;
        background-color: buttonface;
        text-align: center;
        line-height: 30px;
        font-weight: 400;
        font-size: 13.3333px;
        font-family: Arial;
        color: black;
        margin: 10px auto;
    }
    #content::-webkit-scrollbar{
        width:5px;
    }

    #content::-webkit-scrollbar-track{
        background-color: #ffffff;
    }

    #content::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 10px;
        background-color: rgb(3, 172, 6);;
    }
    #content #title{
        width: 100%;
        height: 5%;
        text-indent: 20px;
        line-height: 30px;
        font-size: 20px;
        font-weight: bold;
        color: #1e81c6;
        border-bottom: 1px #b2b2b2 dashed;
        box-sizing:border-box;
    }
    #content #content-title{
        width: 100%;
        height:10%;
        text-indent: 20px;
        line-height: 30px;
        font-size: 20px;
        font-weight: bold;
        color: #1e81c6;
        border-bottom: 1px #b2b2b2 dashed;
        box-sizing:border-box;
        text-align: center;
    }
    #content #content-title a{
        color: #b3b3b3;
        font-family: Arial;
        font-weight:normal;
        font-size: 17px;
    }
    #content-info{
        width: 100%;
        height: 90%;
        overflow: auto;
        padding: 20px;
        box-sizing: border-box;
        word-wrap: break-word;
        word-break: break-all;

    }
    #content #page .pagination{
        display: flex;
        justify-content: center;
    }
    #content-info #confirm{
        width: 200px;
        height: 40px;
        margin: 0 auto;
        display: flex;
        justify-content:space-around;

    }
    #content-info #confirm a{
        display: block;
        background: rgb(252,200,0);
        width: 40%;
        height:100%;
        text-align: center;
        line-height: 40px;
        color: white;
        font-size: 15px;
        border-radius: 5px;
        cursor: pointer;
    }
    #content-info::-webkit-scrollbar{
        width:5px;
    }

    #content-info::-webkit-scrollbar-track{
        background-color: #ffffff;
    }

    #content-info::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 10px;
        background-color: rgb(3, 172, 6);;
    }
    #content #preject{
        width:100%;
        height:85%;
        display:flex;
        flex-wrap: wrap;
        justify-content:space-between;

    }
    #content #preject #preject-info{
        width: 47%;
        height: 30%;
        margin-top: 10px;
        margin-left: 10px;
        margin-right: 10px;
    }
    #content #preject #preject-info #preject-title{
        width: 100%;
        height: 15%;
        border-bottom:1px #1e81c6 solid;
        box-sizing:border-box;
        display: flex;
        justify-content: space-between;

    }
    #content #preject #preject-info #preject-title a{
        font-size: 13px;
        color: #1e81c6;
        font-weight: bold;
    }
    #content #preject #preject-info #preject-title p{
        font-size: 13px;
        color: #1e81c6;
        font-weight: bold;
    }
    #content #preject #preject-info #preject-content{
        width: 100%;
        height: 85%;
        background: #f1f7fc;
        overflow: hidden;
        padding: 10px;
        box-sizing: border-box;
    }
    #content #preject #preject-info #preject-content p{
        font-size: 13px;
        color: #5c9dff;
        overflow: hidden;
    }
    #content #preject #preject-info #preject-content span{
        float: right;
    }
    #content #preject #preject-info #preject-content span a{
        font-size: 13px;
        color: #ffd30b;
    }


    #user{
        width: 30%;
        height: 10%;
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    #user a{
        display: block;
        padding: 0px 5px 0px 5px;
        height: 30px;
        background: #4CAF50;
        text-align: center;
        line-height: 30px;
        font-weight:bolder;
        color: white;
    }
    #user #chocse{
        background: #9E9E9E;
        color: #607D8B;
    }

    #student{
        width: 50%;
        height: 85%;
        margin: 0 auto;
    }
    #student table th {
        text-align: right;
        font-weight: normal;
    }
    #student table input{
        width: 250px;
        height: 30px;
        border: 1px solid #1e81c6;
    }
    #student table .back{
        width: 250px;
        height: 30px;
        border: 1px solid #1e81c6;
        display: block;
        background-color: buttonface;
        text-align: center;
        line-height: 30px;
        font-weight: 400;
        font-size: 13.3333px;
        font-family: Arial;
        color: black;
    }
    #student table select{
        width: 252px;
        height: 30px;
        border: 1px solid #1e81c6;
    }

    #infotable{
        width: 50%;
        height: 85%;
        margin: 0 auto;
    }
    #infotable table{
        width: 100%;
    }
    #infotable button{
        width: 150px;
        height: 35px;
        position: relative;
        left: 50%;
        transform: translate(-50%);
    }
    #infotable table tr{
        height: 30px;
    }
    #infotable table th{
        text-align: center;
        font-weight: normal;
        width: 100px;
        border: 1px solid #1e81c6;
    }
    #infotable table td {
        text-align: center;
        font-weight: normal;
        border: 1px solid #1e81c6;
    }
    #infotable table input{
        width: 99%;
        height: 100%;
        font-size: 20px;
    }


